{% extends "index.html" %}
{% block login_form %}
    <div class="login_link"><a href="/login/">Войти</a></div>
{% endblock %}
{% block content %}
	<div class="in_border welcome">
		<div class="header"><h4>Добро пожаловать в cистему контроля домашнего задания в школах!</h4></div>
	</div>
    <div class="in_border reg_form">
    <div class="header"><h3>Для регистрации заполните эти поля:</h3></div>
        <form method="POST" action="/registration/">
            {% for field in form_reg %}
                    {% if field.errors %}
                        <div class="field_e">
                            <div class="field_label_e">{{ field.label_tag }}</div>
                            <div class="field_act_e">{{ field }}</div>
                            <span class="field_errors">
                                {% for err in field.errors %}
                                    <span class="field_error">{{ err }}&nbsp;</span>
                                {% endfor %}
                            </span>
                        </div>
                    {% else %}
                        <div class="field">
                            <div class="field_label">{{ field.label_tag }}</div>
                            <div class="field_act">{{ field }}</div>
                            <div class="field_info"></div>
                        </div>
                    {% endif %}
            {% endfor %}
            <input type="submit" value="Отправить">
            <input type="reset" value="Очистить">
        </form>
    </div>
    <script type="text/javascript" language="javascript">
        function GetUserExists() {
            var uname = $("#id_username").fieldValue()[0];
            $.getJSON("/api/user/exists", {"uname": uname}, function(json){
                window.j = json;
                if (json.exists == "true") {
                    $(".ok_username").remove();
                    $(".fail_username").remove();
                    $('<span class="fail_username">Это имя уже занято!</span>').appendTo($("#id_username").parent());
                } else {
                    $(".ok_username").remove();
                    $(".fail_username").remove();
                    $('<span class="ok_username">Это имя свободно!</span>').appendTo($("#id_username").parent());
                }

            });
        }
        $("#id_username").blur(GetUserExists);
    </script>
{% endblock %}